<template>
  <div>
    <el-form :model="formItem" label-width="100px" size="mini">
      <el-form-item label="任务状态">
        <el-select v-model="formItem.s_status" clearable placeholder="请选择巡检任务状态" size="mini">
          <el-option v-for="(item) in status" :key="item.value" :label="item.text" :value="item.value" />
        </el-select>
      </el-form-item>
      <el-form-item label="巡检规则">
        <el-select v-model="formItem.s_inspectionRuleCode" clearable placeholder="请选择巡检规则" size="mini">
          <el-option v-for="(item) in inspectionRules" :key="item.code" :label="item.name " :value="item.code" @click.native="clickOption(item)" />
        </el-select>
      </el-form-item>
      <el-form-item label="计划开始时间">
        <el-date-picker
          v-model="timeRangeCreateTimeStart"
          clearable
          type="datetimerange"
          :picker-options="pickerOptions"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          align="right"
          value-format="timestamp"
          size="mini"
        />
      </el-form-item>
      <el-form-item label="计划结束时间">
        <el-date-picker
          v-model="timeRangeEndTime"
          clearable
          type="datetimerange"
          :picker-options="pickerOptions"
          range-separator="至"
          start-placeholder="开始日期"
          end-placeholder="结束日期"
          align="right"
          value-format="timestamp"
          size="mini"
        />
      </el-form-item>
    </el-form>
  </div>
</template>
<script>
import { clone } from '@neu/biz-core/utils/utils'
import { list } from '@neu/dcom-ui/api/inspectionRule'
const formItem = {
  s_status: '',
  s_inspectionRuleCode: '',
  s_startTaskTimeBegin: '',
  s_startTaskTimeEnd: '',
  s_endTaskTimeBegin: '',
  s_endTaskTimeEnd: '',
  s_statistics: 'true'
}
export default {
  name: 'FilterForm',
  props: {
    filter: {
      required: true,
      type: Function
    }
  },
  data() {
    return {
      /** 时间选择器 */
      pickerOptions: {
        shortcuts: [{
          text: '最近一周',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近一个月',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
            picker.$emit('pick', [start, end])
          }
        }, {
          text: '最近三个月',
          onClick(picker) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
            picker.$emit('pick', [start, end])
          }
        }]
      },
      /** 启用状态 */
      status: [
        { value: 'notStarted', text: '待巡检' },
        { value: 'inspecting', text: '巡检中' },
        { value: 'overtime', text: '超时未领取' }, // 超过结束时间未领取
        { value: 'overtimeUnfinished', text: '超时未完成' }, // 已领取，但是超过24小时还未填写结果
        { value: 'overtimeFinished', text: '超时完成' }, // 超过24小时，但是已经完成
        { value: 'finished', text: '已完成' }
      ],
      inspectionRules: [],
      formItem: {
        ...formItem
      },
      timeRangeCreateTimeStart: [],
      timeRangeEndTime: []
    }
  },
  mounted() {
    list().then(response => {
      this.inspectionRules = response.data
    })
  },
  methods: {
    onFilterItemClose(item) {
      this.filter(this.formItem)
    },
    search() {
      if (this.timeRangeCreateTimeStart && this.timeRangeCreateTimeStart.length !== 0) {
        this.formItem.s_startTaskTimeBegin = this.timeRangeCreateTimeStart[0]
        // this.formItem.s_maintenanceStartBegin.valueName = formatDate(this.timeRangeMaintenanceStart[0], 'YYYY-MM-DD')
        this.formItem.s_startTaskTimeEnd = this.timeRangeCreateTimeStart[1]
        // this.formItem.s_maintenanceStartEnd.valueName = formatDate(this.timeRangeMaintenanceStart[1], 'YYYY-MM-DD')
      }
      if (this.timeRangeEndTime && this.timeRangeEndTime.length !== 0) {
        this.formItem.s_endTaskTimeBegin = this.timeRangeEndTime[0]
        // this.formItem.s_maintenanceStartBegin.valueName = formatDate(this.timeRangeMaintenanceStart[0], 'YYYY-MM-DD')
        this.formItem.s_endTaskTimeEnd = this.timeRangeEndTime[1]
        // this.formItem.s_maintenanceStartEnd.valueName = formatDate(this.timeRangeMaintenanceStart[1], 'YYYY-MM-DD')
      }
      this.$store.dispatch('dcom/setInspectionSearchObj', this.formItem)
      this.filter(this.formItem)
    },
    // 重置按钮点击事件处理
    reset: function() {
      this.formItem = clone(formItem)
      this.timeRangeCreateTimeStart = []
      this.timeRangeEndTime = []
      this.search()
    },
    onChange: function(val) {
      this.$parent.onResize()
    },
    clickOption(item) {
      this.formItem.s_inspectionRuleName = item.name
    }

  }

}

</script>
